<p class="user-msg">UserInfo: {{userInfo}}</p>

<div class="row">
<div class="col-md-9">
<div class="card">
<div class="card-header">
    <strong>用户--</strong> 表单
</div>
<div class="card-block">
    <form (ngSubmit)="submitForm()" #userForm="ngForm" enctype="multipart/form-data" class="form-horizontal ">
    <div class="form-group row">
        <label class="col-md-3 form-control-label" for="text-input">用户名</label>
        <div class="col-md-9">
    <input  [(ngModel)]="user.username" name="username" required #username="ngModel"
        type="text" class="form-control" id="username" placeholder="Username">     
        <span class="help-block">用户名必须为英文和数字组合<p [hidden]="username.pristine || username.valid" class="alert alert-danger">用户名不可以为空!</p> </span>
        </div>
    </div>
    <div class="form-group row">
        <label class="col-md-3 form-control-label" for="email-input">邮箱</label>
        <div class="col-md-9">
        <input  [(ngModel)]="user.email" type="email" id="email-input" name="email" class="form-control" placeholder="Email">
        </div>
    </div>
    <div class="form-group row">
        <label class="col-md-3 form-control-label" for="password-input">密码</label>
        <div class="col-md-9">
        <input [(ngModel)]="user.password" type="password" id="password" name="password-input" class="form-control" placeholder="Password">
        <span class="help-block">密码最少6为，因为或者字母组合</span>
        </div>
    </div>
    </form>
</div>
    <div class="card-footer">
    <button (click)="submitForm()" type="button"  class="btn btn-sm btn-primary"><i class="fa fa-dot-circle-o"></i> 提交</button>
    <button (click)="cleanForm()" type="reset" class="btn btn-sm btn-danger"><i class="fa fa-ban"></i> 重置</button>
    </div>
</div>
